<template>
  <div id="dianpu">
      <div class="toutop">
      <div class="beij"> </div>
      <div class="beijzi">
        <div class="beijingzi">
          <div class="beijingzi_img">
            <img src="../assets/shop-logo.png" alt="">
          </div>
          <div class="beijingzi_word clear">
            <h3 class="zi">上海麦当劳</h3>
            <p class="zi"><span>蜂鸟配送</span><span>商家配送</span>分钟送达／配送费¥</p>
            <p class="zi">公告：</p>
          </div>
          <p class="gonggao zi"><i class="jian">减</i><span>新用户有优惠</span></p>
        </div>
      </div>
      
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
  .dianpu{
  width:100%;
  height:100%;
  .toutop{
    height:3rem;
    position:relative;
    .beij{
      width:100%;
      height:100%;
      position:absolute;
      background: url(../assets/shop-logo.png) no-repeat center;
      background-size: cover;
      -webkit-filter:blur(.08rem);
      filter:blur(.08rem);
      z-index: 1;
    }
    .beijzi{
      width:100%;
      height:100%;
      position:absolute;
      padding: .3rem;
      box-sizing:border-box;
      z-index:2;
      .beijingzi{
        .beijingzi_img{
          img{
            width:1.8rem;
            height:1.8rem;
            border-radius: .1rem;
            float: left;
          }
        }
        .beijingzi_word{
          margin-left:2rem;
          color:#fff;
          h3{
            font-size:.7rem;
          }
          p{
            font-size:.37rem;
          }
        }
        .gonggao{
          font-size:.3rem;
          color:#fff;
          line-height:.8rem;
          .jian{
            display:inline-block;
            width:.35rem;
            height:.35rem;
            background:rgb(240, 115, 115);
            line-height:.35rem;
            text-align:center;
            vertical-align:middle;
            font-style: normal;
            font-size:.25rem;
            margin-right: .1rem;

          }
          span{vertical-align:middle;}
        }
      }
    }
  }
  }
</style>
